<template>
    <div>
        <el-row :gutter="15">
            <el-form
                ref="elForm"
                :model="formData"
                :rules="rules"
                size="medium"
                label-width="100px"
            >
                <el-form-item label="撤押日期" prop="unPledgeTime">
                    <el-date-picker
                        v-model="formData.pledgeTime"
                        format="yyyy-MM-dd"
                        value-format="yyyy-MM-dd"
                        :style="{ width: '100%' }"
                        placeholder="请选择撤押日期"
                        clearable
                    ></el-date-picker>
                </el-form-item>

                <el-form-item label="备注" prop="remarks">
                    <el-input
                        v-model="formData.remarks"
                        placeholder="请输入备注"
                        clearable
                        :style="{ width: '100%' }"
                    >
                    </el-input>
                </el-form-item>
            </el-form>
        </el-row>
    </div>
</template>
<script>
import { unpledgeInfo, getDetail } from "@/api/finance/receivebill";
export default {
    props: ["rowId"],
    data() {
        return {
            formData: {
                unPledgeTime: undefined,
                remarks: undefined,
            },
            rules: {
                pledgeTime: [
                    {
                        required: true,
                        message: "请选择质押日期",
                        trigger: "change",
                    },
                ],
            },
        };
    },
    methods: {
        submit(cb) {
            this.$refs["elForm"].validate((valid) => {
                if (!valid) return;
                // TODO 提交表单
                if (this.rowId) {
                    unpledgeInfo(this.formData).then((res) => {
                        if (res.code === 200) {
                            this.$message({
                                message: "操作成功！",
                                type: "success",
                            });
                            cb();
                        }
                    });
                }
            });
        },
    },
    mounted() {
        if (this.rowId) {
            console.log(this.rowId);
            getDetail(this.rowId).then((res) => {
                if (res.code === 200) {
                    this.formData = {
                        ...this.formData,
                        ...res.data.kingFinanceReceiptBillEntity,
                    };
                }
            });
        }
    },
};
</script>
<style></style>
